<template>
	<view>
		<c-sticky>
			
			<c-status-bar />
			<c-page-header title="首页" :can-back="false">
				<view>
				<text class="mr-5 iconfont icon-sousuo page-header-icon" @tap="toSearchPage"></text>
				<text class="iconfont icon-bianji page-header-icon" @tap="toEditorPage"></text>
				</view>
			</c-page-header>
		</c-sticky>
		
		<unicloud-db v-slot:default="{data,error,options}" 
		collection="topics" :page-size="3"
		field="title,cover.url as url"
		orderby="creat_date desc"
		ref="topics"
		>
			<c-error-tip v-if="error" :msg="error.message" />
			<view v-else>
				<c-banner :values="data"></c-banner>
			</view>
		</unicloud-db>
		
		<c-desc title="实时"></c-desc>
		<unicloud-db v-slot="{data,loading,error,hasMore}" 
		collection="posts,uni-id-users,topics"
		:field="`creat_date,arrayElemAt(author.username,0) as username,
		arrayElemAt(author.avatar,0) as avatarUrl,title,imgs,topic_ids.title as topics,
		size(praise_user_ids._id) as praiseNum,in('${uid}',praise_user_ids._id) as praiseStatus,
		size(love_user_ids._id) as loveNum,in('${uid}',love_user_ids._id) as loveStatus
		`"
		ref="posts"
		orderby="creat_date desc"
		>
			<!-- <view v-if="error">{{error.message}}</view> -->
			<c-error-tip v-if="error" :msg="error.message" />
			<view v-else>
				<!-- {{data}} -->
				<c-posts :values="data" @praise="praise" @love="love"
				@toPost="toPostPage"
				/>
				
				<c-scroll-load-more :hasMore="hasMore" :loading="loading"></c-scroll-load-more>
			</view>
		</unicloud-db>
		
		
		<c-back-top bottom="130rpx" right="50rpx"/>
	</view>
</template>

<script>
	
	import BackTopMixin from "@/components/c-back-top/c-back-top-mixin.js"
	export default {
		mixins:[BackTopMixin],
		
		data() {
			const {uid} = uniCloud.getCurrentUserInfo()
			return {
				uid
			}
		},
	async onPullDownRefresh(){
			const topicsPromise = new Promise(resolve=>{
				this.$refs.topics.loadData({
					clear:true
				},resolve)
			})
			
			const postsPromise = new Promise(resolve=>{
				this.$refs.posts.loadData({
					clear:true
				},resolve)
			})
			
			await Promise.all([postsPromise,topicsPromise])
			
			uni.stopPullDownRefresh()
			
			
		},
		destroyed(){
				uni.$off('getPost')
		},
		methods: {
			toSearchPage(){
				uni.navigateTo({
					url:"/pages/search/search"
				})
			},
			toEditorPage(){
				uni.navigateTo({
					url:"/pages/editor/editor"
				})
			},
		 async	praise(op){
			 const {postID,praiseStatus,fail,success,complete} = op
				try{
					await this.$A.post.praise({
						uid:this.uid,
						postID,
						praiseStatus
						
					})
					
					success()
				}catch(e){
					//TODO handle the exception
					fail(e.message)
				}finally{
					complete()
				}
			},
			async	love(op){
				 const {postID,loveStatus,fail,success,complete} = op
					try{
						await this.$A.post.love({
							uid:this.uid,
							postID,
							loveStatus
							
						})
						
						success()
					}catch(e){
						//TODO handle the exception
						fail(e.message)
					}finally{
						complete()
					}
			},
			toPostPage(v){
				// console.log(v,"test")
				uni.$once('getPost',fn=>fn(v))
				uni.navigateTo({
					url:'/pages/post/post'
				})	
			}
		
			
		}
		
	}
</script>

<style  scoped>
	.page-header-icon{
		font-size:45rpx;
	}
</style>
